<div>
  <label for="Notes">
    <span class="text-sm font-medium text-gray-700"> Notes </span>

    <div
      class="relative mt-0.5 overflow-hidden rounded border border-gray-300 shadow-sm focus-within:ring focus-within:ring-blue-600"
    >
      <textarea
        id="Notes"
        class="w-full resize-none border-none focus:ring-0 sm:text-sm"
        rows="4"
      ></textarea>

      <div class="flex items-center justify-end gap-2 p-1.5">
        <button
          type="button"
          class="rounded border border-transparent px-3 py-1.5 text-sm font-medium text-gray-700 transition-colors hover:text-gray-900"
        >
          Clear
        </button>

        <button
          type="button"
          class="rounded border border-gray-300 px-3 py-1.5 text-sm font-medium text-gray-900 shadow-sm transition-colors hover:bg-gray-100"
        >
          Save
        </button>
      </div>
    </div>
  </label>
</div>
